import Button from 'src/component/Button';
import style from './AccountCard.module.scss';

type BankAccount = any

export type Props = {
  data: BankAccount[];
  onClickDelete: (id: string) => void;
};

const AccountCard = ({ data, onClickDelete }: Props) => {

  const elementsMapFunction = (v: BankAccount) => (
    <div key={v.FID}>
      <div className={style.FBHm}>
        <div>{v.FBMc}</div>
        <div>{v.FBZh}</div>
        <div>{v.FBSf}</div>
        <div className={style.location}>
          <div>{v.FBCs}</div>
          <div>{v.FBFy}</div>
        </div>
        <div className={style.last}>
          <div>{v.bankBranchName}</div>
          <Button appearance="text" className={style.button} onClick={() => onClickDelete(v.FID)}>
            删除
          </Button>
        </div>
      </div>
      <div className={style.divider} />
    </div>
  );

  return <div>{data.map(elementsMapFunction)}</div>;
};

export default AccountCard;
